import { Link, Switch, TableRowData, Tag } from 'tdesign-vue-next';
import { withDirectives } from 'vue';

import { $auth, vAuth } from '@/directives/auth';
import { t } from '@/locales';

import { mitter } from './mitt';

export interface TableActionBtnOptions {
  type: string;
  h: Function;
  row: TableRowData;
  auths?: string[];
  theme?: string;
}

/**
 * 创建表格操作按钮。
 *
 * 该函数用于根据提供的选项生成一个具有特定行为的按钮虚拟节点（vnode）。按钮的文字内容、样式和行为根据选项中的配置确定。
 * 主要用于在表格行内显示操作按钮，如编辑、删除等操作。
 *
 * @param options 配置选项，包括按钮类型、Vue 的渲染函数、数据行对象、权限数组和主题样式。
 * @returns 返回带有指令的按钮虚拟节点，用于在 Vue 中渲染。
 */
export const tableActionBtn = (options: TableActionBtnOptions) => {
  // 解构配置选项，提取必要字段
  const { type, h, row, auths = [], theme } = options;
  const lastType = type.includes(':') ? type.split(':').reverse()[0] : type;
  // 根据提供的选项，使用Vue的渲染函数h创建一个Link组件的虚拟节点
  // Link组件代表一个操作按钮，其内容、主题样式和点击行为通过传递的属性定义
  const vnode = h(Link, {
    content: t(`common.${lastType}`), // 按钮显示文本，通过国际化函数t获取
    theme: theme || (lastType === 'delete' ? 'danger' : 'primary'), // 按钮主题样式，默认为primary，如果是删除操作则为danger
    onClick() {
      // 点击按钮时，触发mitter事件，事件名称为视图名称和操作类型的组合，携带当前行数据row
      mitter.emit(`${type}`, JSON.parse(JSON.stringify(row)));
    },
  });

  // 返回带有vAuth指令的虚拟节点，用于权限检查，vAuth指令的参数是权限数组auths
  return withDirectives(vnode, [[vAuth, auths]]);
};

/**
 * 根据权限和行数据生成开关或标签组件。
 *
 * 该函数用于在表格中根据用户的权限和行数据的状态，决定是显示一个开关组件还是一个标签组件。
 * 开关用于显示和隐藏行数据，标签则仅用于显示状态文本。权限检查通过$auth函数完成。
 *
 * @param h 渲染函数，用于创建组件实例。
 * @param row 表格行数据，包含显示状态信息。
 * @param auth 用户权限数组，用于检查用户是否有权更改显示状态。
 * @returns 返回根据权限和显示状态生成的开关或标签组件实例。
 */
export const tableSwitch = (h: Function, row: TableRowData, auth: string[]) => {
  if (row.display === undefined) {
    return '';
  }
  // 检查用户是否有权限更改显示状态
  const isAuth: boolean = $auth(auth);

  // 根据行数据的显示状态决定显示文本，0为隐藏，1为显示
  const text: string = ['common.hide', 'common.show'][row.display];

  // 创建开关组件实例，用于更改行数据的显示状态
  const eleSwitch = h(Switch, {
    value: row.display,
    customValue: [1, 0],
    onChange() {
      // 当开关状态改变时，通过mitter发射事件，传递改变后的行数据
      mitter.emit(`display`, row);
    },
  });

  // 创建标签组件实例，用于显示行数据的显示状态文本
  const eleTag = h(Tag, {
    content: t(text),
    variant: 'light',
    shape: 'round',
    theme: ['default', 'success'][row.display],
  });

  // 根据权限决定返回开关还是标签组件
  return isAuth ? eleSwitch : eleTag;
};
